<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title></title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <link rel="stylesheet" href="/css/font.css">
    <link rel="stylesheet" href="/css/xadmin.css">
    <link rel="stylesheet" href="/layui/css/layui.css">
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>

<body class="layui-anim layui-anim-up">

<div class="demoTable" style="margin: 20px 0 0 3%;">
    搜索：
    <div class="layui-inline">
        <input class="layui-input" name="blogName" id="blogName" placeholder="请输入手机号" autocomplete="off">
    </div>
    <button class="layui-btn" data-type="reload">搜索</button>
</div>
<table id="apply" lay-filter="test"></table>
<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>


</div>
<script src="/js/jquery.min.js"></script>
<script src="/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="/js/xadmin.js"></script>


<script>
    layui.use('table', function () {
        var table = layui.table;
        table.render({
            elem: '#apply'
            , height: 500
            , even: true
            , url: '/message/data'
            , response: {
                statusName: 'code' //规定数据状态的字段名称，默认：code
                , statusCode: 200 //规定成功的状态码，默认：0
                , msgName: 'msg' //规定状态信息的字段名称，默认：msg
                , countName: 'total' //规定数据总数的字段名称，默认：count
                , dataName: 'data' //规定数据列表的字段名称，默认：data
            }
            , page: true
            , cols: [
                [{field: 'phone', title: '手机号'},
                    {field: 'intention', title: '回馈意向'}

                    , {
                    field: 'createTime', title: '留言时间', templet: function (row) {
                        return createTime(row.createTime);
                    }
                }
                    , {fixed: 'right', title: '操作', toolbar: '#barDemo'}

                ]
            ],
            id: 'applyReload'
        });

        //监听行工具事件
        table.on('tool(test)', function (obj) {
            var data = obj.data;
            if (obj.event === 'edit') {
                var url = '/leave/message/edit?id=' + data.id;
                x_admin_show("编辑信息", url)
            } else if (obj.event === 'del') {
                layer.confirm('确定删除吗？', function (index) {
                    $.ajax({
                        url: "/message/del?id=" + data.id,
                        success: function (msg) {
                            //删除这一行
                            obj.del();
                            //关闭弹框
                            layer.close(index);
                            layer.msg("删除成功", {icon: 6});

                        }
                    });
                    return false;
                });
            }
        });


        var $ = layui.$, active = {
            reload: function () {
                var blogName = $('#blogName');
                //执行重载
                table.reload('applyReload', {
                    page: {
                        curr: 1 //重新从第 1 页开始
                    }
                    , where: {
                        phone: blogName.val()
                    }
                }, 'data');
            }
        };

        $('.demoTable .layui-btn').on('click', function () {
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });


    });
</script>
<script type="text/javascript">
    function createTime(v) {
        var date = new Date(v);
        var y = date.getFullYear();
        var m = date.getMonth() + 1;
        m = m < 10 ? '0' + m : m;
        var d = date.getDate();
        d = d < 10 ? ("0" + d) : d;
        var h = date.getHours();
        h = h < 10 ? ("0" + h) : h;
        var M = date.getMinutes();
        M = M < 10 ? ("0" + M) : M;
        var str = y + "-" + m + "-" + d + " " + h + ":" + M;
        return str;
    }
</script>
</body>

</html>